<template>
	<div class="list-friends">
		<ul class="list-ul">
			<router-link tag="li" to="/contacts" class="list-li"><span>好友</span></router-link>
			<router-link tag="li" to="#qun" class="list-li"><span>群聊</span></router-link>
			<router-link tag="li" to="#she" class="list-li"><span>设备</span></router-link>
			<router-link tag="li" to="#tong" class="list-li"><span>通讯录</span></router-link>
			<router-link tag="li" to="#gong" class="list-li"><span>公众号</span></router-link>
		</ul>
	</div>
</template>

<style lang="stylus" scoped>
.list-friends
	height:1.2rem
	.list-ul
		.list-li
			float:left
			width: 20%;
			text-align: center
			line-height: 1.2rem;
			color:#888a96
		.router-link-exact-active
			span
				border-radius: 15px;
				background: #e7faff;
				padding: 8px 15px;
				color:#05c8f6
</style>